
<template>
  <div>
    <!-- <el-form>
    
          <el-form-item label="author">
        <el-input v-model="form.author"></el-input>
      </el-form-item>

          <el-form-item label="createTime">
        <el-input v-model="form.createTime"></el-input>
      </el-form-item>

          <el-form-item label="endDate">
        <el-input v-model="form.endDate"></el-input>
      </el-form-item>

          <el-form-item label="endTime">
        <el-input v-model="form.endTime"></el-input>
      </el-form-item>

          <el-form-item label="id">
        <el-input v-model="form.id"></el-input>
      </el-form-item>

          <el-form-item label="multiScreenSync">
        <el-input v-model="form.multiScreenSync"></el-input>
      </el-form-item>

          <el-form-item label="planName">
        <el-input v-model="form.planName"></el-input>
      </el-form-item>

          <el-form-item label="playDate">
        <el-input v-model="form.playDate"></el-input>
      </el-form-item>

          <el-form-item label="playMode">
        <el-input v-model="form.playMode"></el-input>
      </el-form-item>

          <el-form-item label="playStrategy">
        <el-input v-model="form.playStrategy"></el-input>
      </el-form-item>

          <el-form-item label="programId">
        <el-input v-model="form.programId"></el-input>
      </el-form-item>

          <el-form-item label="reason">
        <el-input v-model="form.reason"></el-input>
      </el-form-item>

          <el-form-item label="reviewedBy">
        <el-input v-model="form.reviewedBy"></el-input>
      </el-form-item>

          <el-form-item label="startDate">
        <el-input v-model="form.startDate"></el-input>
      </el-form-item>

          <el-form-item label="startTime">
        <el-input v-model="form.startTime"></el-input>
      </el-form-item>

          <el-form-item label="status">
        <el-input v-model="form.status"></el-input>
      </el-form-item>

          <el-form-item label="thumbnail">
        <el-input v-model="form.thumbnail"></el-input>
      </el-form-item>

          <el-form-item label="timeSlotDtos">
        <el-input v-model="form.timeSlotDtos"></el-input>
      </el-form-item>

          <el-form-item label="updateTime">
        <el-input v-model="form.updateTime"></el-input>
      </el-form-item>

</el-form>
 -->

    <el-form
      :inline="true"
      :model="submitData"
      class="demo-form-inline"
      :rules="rules"
      ref="ruleForm"
    >
      <el-card class="box-card">
        <!-- materialList{{materialList}} -->
        materialList
        <div :key="material.id" v-for="material in materialList">
          {{ material }}
          <el-button @click="choose(material)">选择</el-button>
        </div>

        <div class="header clearfix">
          <span>plan</span>
          <el-button
            v-if="!ischeck && !isFind"
            class="fr"
            type="primary"
            @click="validate('ruleForm')"
            >提交</el-button
          >

          <el-button v-else class="fr" type="primary" @click="goBack"
            >返回</el-button
          >
          <el-button @click="addTimeSlot">addTimeSlot</el-button>
        </div>
        <el-form-item label="id" prop="id">
          <el-input placeholder="请输入id" v-model="formData.id"></el-input>
        </el-form-item>
        <el-form-item label="缩略图" prop="thumbnail">
          <el-input
            placeholder="请输入缩略图"
            v-model="formData.thumbnail"
          ></el-input>
        </el-form-item>
        <el-form-item label="计划名称" prop="planName">
          <el-input
            placeholder="请输入计划名称"
            v-model="formData.planName"
          ></el-input>
        </el-form-item>
        <el-form-item label="计划状态" prop="status">
          <el-input
            placeholder="请输入计划状态"
            v-model="formData.status"
          ></el-input>
        </el-form-item>
        <el-form-item label="播放模式" prop="playMode">
          <el-input
            placeholder="请输入播放模式"
            v-model="formData.playMode"
          ></el-input>
        </el-form-item>
        <el-form-item label="播放日期" prop="playDate">
          <el-input
            placeholder="请输入播放日期"
            v-model="formData.playDate"
          ></el-input>
        </el-form-item>
        <el-form-item label="作者" prop="author">
          <el-input
            placeholder="请输入作者"
            v-model="formData.author"
          ></el-input>
        </el-form-item>
        <el-form-item label="审核人" prop="reviewedBy">
          <el-input
            placeholder="请输入审核人"
            v-model="formData.reviewedBy"
          ></el-input>
        </el-form-item>
        <el-form-item label="更新时间" prop="updateTime">
          <el-input
            placeholder="请输入更新时间"
            v-model="formData.updateTime"
          ></el-input>
        </el-form-item>
        <el-form-item label="多屏同步" prop="multiScreenSync">
          <el-input
            placeholder="请输入多屏同步"
            v-model="formData.multiScreenSync"
          ></el-input>
        </el-form-item>
        <el-form-item label="开始日期" prop="startDate">
          <el-input
            placeholder="请输入开始日期"
            v-model="formData.startDate"
          ></el-input>
        </el-form-item>
        <el-form-item label="结束日期" prop="endDate">
          <el-input
            placeholder="请输入结束日期"
            v-model="formData.endDate"
          ></el-input>
        </el-form-item>
        <el-form-item label="开始时间" prop="startTime">
          <el-input
            placeholder="请输入开始时间"
            v-model="formData.startTime"
          ></el-input>
        </el-form-item>
        <el-form-item label="结束时间" prop="endTime">
          <el-input
            placeholder="请输入结束时间"
            v-model="formData.endTime"
          ></el-input>
        </el-form-item>
        <el-form-item label="创建时间" prop="createTime">
          <el-input
            placeholder="请输入创建时间"
            v-model="formData.createTime"
          ></el-input>
        </el-form-item>
        <el-form-item label="播放策略" prop="playStrategy">
          <el-input
            placeholder="请输入播放策略"
            v-model="formData.playStrategy"
          ></el-input>
        </el-form-item>
        <el-form-item label="原因" prop="reason">
          <el-input
            placeholder="请输入原因"
            v-model="formData.reason"
          ></el-input>
        </el-form-item>
        <el-form-item label="节目id" prop="programId">
          <el-input
            placeholder="请输入节目id"
            v-model="formData.programId"
          ></el-input>
        </el-form-item>
      </el-card>
    </el-form>
    <div>
      program program.programName
      {{ program.programName }}
    </div>

    <!-- {{ program }} -->

    <!-- <el-form>
      
            <el-form-item label="id">
          <el-input  placeholder="id" v-model="program.id"></el-input>
        </el-form-item>

            <el-form-item label="thumbnail">
          <el-input  placeholder="thumbnail" v-model="program.thumbnail"></el-input>
        </el-form-item>

            <el-form-item label="programName">
          <el-input  placeholder="programName" v-model="program.programName"></el-input>
        </el-form-item>

            <el-form-item label="resolutionRatio">
          <el-input  placeholder="resolutionRatio" v-model="program.resolutionRatio"></el-input>
        </el-form-item>

            <el-form-item label="duration">
          <el-input  placeholder="duration" v-model="program.duration"></el-input>
        </el-form-item>

            <el-form-item label="programSize">
          <el-input  placeholder="programSize" v-model="program.programSize"></el-input>
        </el-form-item>

            <el-form-item label="status">
          <el-input  placeholder="status" v-model="program.status"></el-input>
        </el-form-item>

            <el-form-item label="author">
          <el-input  placeholder="author" v-model="program.author"></el-input>
        </el-form-item>

            <el-form-item label="updateTime">
          <el-input  placeholder="updateTime" v-model="program.updateTime"></el-input>
        </el-form-item>

  </el-form> -->

    一个节目默认就会产生一个计划 点击节目 跳转计划 计划会有一些默认值

    <fieldset>
      所有的时间段 postFormPlan. timeSlotDtos
      <div
        :key="timeSlotDto.id"
        v-for="timeSlotDto in postFormPlan.timeSlotDtos"
      >
        <!-- <div>
        timeSlotDto
        {{ timeSlotDto }}
      </div> -->

        <!-- 
      <br />
      vals
      <div :key="val" v-for="val in timeSlotDto">
        {{ val }}
      </div> -->

        <br />
        timeSlotDto.materials

        <fieldset>
          一个时间段
          <div>timeSlotDto.startTime</div>
          <!-- <div>{{timeSlotDto.startTime}}</div> -->
          <el-date-picker
            v-model="timeSlotDto.startTime"
            type="date"
            placeholder="选择日期开始时间"
            @change="dateChange"
          ></el-date-picker>
          <div>timeSlotDto.endTime</div>
          <div>{{ timeSlotDto.endTime }}</div>

          <el-date-picker
            v-model="timeSlotDto.endTime"
            type="date"
            placeholder="选择日期结束时间"
            @change="dateChange"
          ></el-date-picker>
        </fieldset>
        <div :key="material.id" v-for="material in timeSlotDto.materials">
          <!-- {{ material }} -->
          <fieldset>
            一个 material
            <el-form>
              <el-form-item label="filename">
                <el-input v-model="material.filename"></el-input>
              </el-form-item>

              <!-- <el-form-item label="id">
              <el-input v-model="material.id"></el-input>
            </el-form-item>

            <el-form-item label="parentId">
              <el-input v-model="material.parentId"></el-input>
            </el-form-item>

            <el-form-item label="path">
              <el-input v-model="material.path"></el-input>
            </el-form-item>

            <el-form-item label="programCount">
              <el-input v-model="material.programCount"></el-input>
            </el-form-item>

            <el-form-item label="resolutionRatio">
              <el-input v-model="material.resolutionRatio"></el-input>
            </el-form-item>

            <el-form-item label="size">
              <el-input v-model="material.size"></el-input>
            </el-form-item>

            <el-form-item label="type">
              <el-input v-model="material.type"></el-input>
            </el-form-item>

            <el-form-item label="updateTime">
              <el-input v-model="material.updateTime"></el-input>
            </el-form-item>

            <el-form-item label="url">
              <el-input v-model="material.url"></el-input>
            </el-form-item>

            <el-form-item label="userId">
              <el-input v-model="material.userId"></el-input>
            </el-form-item>  -->
            </el-form>
          </fieldset>
        </div>
      </div>
    </fieldset>

    <div class="container">
      <div class="queryForm">
        <el-input
          v-model="query.id"
          placeholder="id"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.thumbnail"
          placeholder="缩略图"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.planName"
          placeholder="计划名称"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.status"
          placeholder="计划状态"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.playMode"
          placeholder="播放模式"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.playDate"
          placeholder="播放日期"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.author"
          placeholder="作者"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.reviewedBy"
          placeholder="审核人"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.updateTime"
          placeholder="更新时间"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.multiScreenSync"
          placeholder="多屏同步"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.startDate"
          placeholder="开始日期"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.endDate"
          placeholder="结束日期"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.startTime"
          placeholder="开始时间"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.endTime"
          placeholder="结束时间"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.createTime"
          placeholder="创建时间"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.playStrategy"
          placeholder="播放策略"
          class="handle-input"
        ></el-input>
        <el-input
          v-model="query.reason"
          placeholder="原因"
          class="handle-input"
        ></el-input>
        <!-- width="200" -->
        <el-input
          width="50"
          v-model="query.programId"
          placeholder="节目id"
          class="handle-input"
        ></el-input>
      </div>

      <el-button type="primary" icon="el-icon-search" @click="handleSearch"
        >搜索</el-button
      >

      <el-button @click="loadList">刷新</el-button>
      <el-table
        :data="tableData"
        border
        class="table"
        ref="multipleTable"
        header-cell-class-name="table-header"
      >
        <el-table-column prop="id" label="id" align="center"></el-table-column>
        <el-table-column prop="id" label="id" align="center"></el-table-column>
        <el-table-column
          prop="thumbnail"
          label="缩略图"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="planName"
          label="计划名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="status"
          label="计划状态"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="playMode"
          label="播放模式"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="playDate"
          label="播放日期"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="author"
          label="作者"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="reviewedBy"
          label="审核人"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="updateTime"
          label="更新时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="multiScreenSync"
          label="多屏同步"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="startDate"
          label="开始日期"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="endDate"
          label="结束日期"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="startTime"
          label="开始时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="endTime"
          label="结束时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="createTime"
          label="创建时间"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="playStrategy"
          label="播放策略"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="reason"
          label="原因"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="programId"
          label="节目id"
          align="center"
        ></el-table-column>
        <el-table-column label="操作" width="120" align="center" fixed="right">
          <template v-slot="scope">
            <el-button
              type="text"
              icon="el-icon-edit"
              @click="handleEdit(scope.$index, scope.row)"
              >编辑
            </el-button>
            <el-button
              type="text"
              icon="el-icon-delete"
              class="red"
              @click="handleDelete(scope.$index, scope.row)"
              >删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>

      postFormPlan{{ postFormPlan }}
      <div class="pagination">
        <el-pagination
          background
          layout="prev, pager, next"
          :current-page="pageParam.pageIndex"
          :page-size="pageParam.pageSize"
          :total="pageTotal"
          @current-change="load"
        >
        </el-pagination>
      </div>

      <hr />

      nowPlan {{ nowPlan }}
      <el-dialog
        class="edit-dialog"
        title="编辑"
        v-model="editVisible"
        width="30%"
      >
        <el-form ref="formEdit" :model="formEdit" label-width="110px">
          <el-form-item label="id">
            <el-input v-model="formEdit.id"></el-input>
          </el-form-item>
          <el-form-item label="缩略图">
            <el-input v-model="formEdit.thumbnail"></el-input>
          </el-form-item>
          <el-form-item label="计划名称">
            <el-input v-model="formEdit.planName"></el-input>
          </el-form-item>
          <el-form-item label="计划状态">
            <el-input v-model="formEdit.status"></el-input>
          </el-form-item>
          <el-form-item label="播放模式">
            <el-input v-model="formEdit.playMode"></el-input>
          </el-form-item>
          <el-form-item label="播放日期">
            <el-input v-model="formEdit.playDate"></el-input>
          </el-form-item>
          <el-form-item label="作者">
            <el-input v-model="formEdit.author"></el-input>
          </el-form-item>
          <el-form-item label="审核人">
            <el-input v-model="formEdit.reviewedBy"></el-input>
          </el-form-item>
          <el-form-item label="更新时间">
            <el-input v-model="formEdit.updateTime"></el-input>
          </el-form-item>
          <el-form-item label="多屏同步">
            <el-input v-model="formEdit.multiScreenSync"></el-input>
          </el-form-item>
          <el-form-item label="开始日期">
            <el-input v-model="formEdit.startDate"></el-input>
          </el-form-item>
          <el-form-item label="结束日期">
            <el-input v-model="formEdit.endDate"></el-input>
          </el-form-item>
          <el-form-item label="开始时间">
            <el-input v-model="formEdit.startTime"></el-input>
          </el-form-item>
          <el-form-item label="结束时间">
            <el-input v-model="formEdit.endTime"></el-input>
          </el-form-item>
          <el-form-item label="创建时间">
            <el-input v-model="formEdit.createTime"></el-input>
          </el-form-item>
          <el-form-item label="播放策略">
            <el-input v-model="formEdit.playStrategy"></el-input>
          </el-form-item>
          <el-form-item label="原因">
            <el-input v-model="formEdit.reason"></el-input>
          </el-form-item>
          <el-form-item label="节目id">
            <el-input v-model="formEdit.programId"></el-input>
          </el-form-item>
        </el-form>
        <span class="dialog-footer">
          <el-button
            @click="
              editVisible = false;
              getData();
            "
            >取 消</el-button
          >
          <el-button type="primary" @click="saveEdit">确 定</el-button>
        </span>
      </el-dialog>

      <el-button @click="genForm">genForm</el-button>
      <el-button @click="materialGen">materialGen</el-button>
      <el-button @click="programGen">programGen</el-button>
      <el-button @click="genJpaSave">genJpaSave</el-button>
    </div>
  </div>
</template>

<script>
// import method from "@/utils/method";
// import Common from "@/common/common";
// import Commen from "../utils/common";
import Commen from "@/utils/common";
import CodeGen from "@/utils/CodeGen";
import ObjUtil from "@/utils/ObjUtil";
import axios from "axios";

export default {
  name: "PlanTable",
  components: {},
  data() {
    return {
      submitData: {},
      ischeck: false,
      isFind: false,
      tableName: "plan",
      formData: {
        id: "",
        thumbnail: "",
        planName: "",
        status: "",
        playMode: "",
        playDate: "",
        author: "",
        reviewedBy: "",
        updateTime: "",
        multiScreenSync: "",
        startDate: "",
        endDate: "",
        startTime: "",
        endTime: "",
        createTime: "",
        playStrategy: "",
        reason: "",
        programId: "",
      },
      value: "选项1",
      editVisible: false,
      form: [],
      formEdit: [],
      program: {},

      query: {
        // uname: "",
        // pname: "",
        // pageIndex: 1,
        // pageSize: 10

        id: null,
        thumbnail: null,
        planName: null,
        status: null,
        playMode: null,
        playDate: null,
        author: null,
        reviewedBy: null,
        updateTime: null,
        multiScreenSync: null,
        startDate: null,
        endDate: null,
        startTime: null,
        endTime: null,
        createTime: null,
        playStrategy: null,
        reason: null,
        programId: null,
        pageIndex: 1,
        pageSize: 10,
      },
      pageParam: {
        pageNumber: 0,
        pageSize: 10,
      },
      postFormPlan: {
        author: "string",
        createTime: "string",
        endDate: "string",
        endTime: "string",
        id: 0,
        multiScreenSync: "string",
        planName: "string",
        playDate: "string",
        playMode: "string",
        playStrategy: "string",
        programId: 0,
        reason: "string",
        reviewedBy: "string",
        startDate: "string",
        startTime: "string",
        status: "string",
        thumbnail: "string",
        // 如果是 list  获取 id plan Id 和timeSlot id 配对
        // for(){

        // }
        timeSlotDtos: [
          {
            endTime: "2022-06-29T05:51:56.471Z",
            materials: [
              {
                filename: "string",
                id: 0,
                parentId: 0,
                path: "string",
                programCount: 0,
                resolutionRatio: "string",
                size: 0,
                type: "string",
                updateTime: "2022-06-29T05:51:56.471Z",
                url: "string",
                userId: 0,
              },
            ],
            programs: [
              {
                author: "string",
                duration: "string",
                id: 0,
                programName: "string",
                programSize: "string",
                resolutionRatio: "string",
                status: "string",
                thumbnail: "string",
                updateTime: "2022-06-29T05:51:56.471Z",
              },
            ],
            startTime: "2022-06-29T05:51:56.471Z",
          },

          {
            endTime: "2022-06-29T05:51:56.471Z",
            materials: [
              {
                filename: "string",
                id: 0,
                parentId: 0,
                path: "string",
                programCount: 0,
                resolutionRatio: "string",
                size: 0,
                type: "string",
                updateTime: "2022-06-29T05:51:56.471Z",
                url: "string",
                userId: 0,
              },
            ],
            programs: [
              {
                author: "string",
                duration: "string",
                id: 0,
                programName: "string",
                programSize: "string",
                resolutionRatio: "string",
                status: "string",
                thumbnail: "string",
                updateTime: "2022-06-29T05:51:56.471Z",
              },
            ],
            startTime: "2022-06-29T05:51:56.471Z",
          },
        ],
        updateTime: "string",
      },
      materialList: [],
      nowPlan: {},
      tableKey: 0,
      list: null,
      total: 0,
      listLoading: true,
      listQuery: {
        page: 1,
        limit: 20,
        importance: undefined,
        title: undefined,
        type: undefined,
        sort: "+id",
      },
      sortOptions: [
        { label: "ID Ascending", key: "+id" },
        { label: "ID Descending", key: "-id" },
      ],
      statusOptions: ["published", "draft", "deleted"],
      showReviewer: false,
      temp: {
        id: undefined,
        importance: 1,
        remark: "",
        timestamp: new Date(),
        title: "",
        type: "",
        status: "published",
      },
      dialogFormVisible: false,
      dialogStatus: "",
      textMap: {
        update: "Edit",
        create: "Create",
      },
      dialogPvVisible: false,
      pvData: [],
      rules: {
        type: [
          { required: true, message: "type is required", trigger: "change" },
        ],
        timestamp: [
          {
            type: "date",
            required: true,
            message: "timestamp is required",
            trigger: "change",
          },
        ],
        title: [
          { required: true, message: "title is required", trigger: "blur" },
        ],
      },
      downloadLoading: false,
      tableData: [],
      pageTotal: 0,
    };
  },

  created() {
    let programId = this.$route.query.programId;
    // programId
    // find
    // getOne
    console.log("programId");
    console.log(programId);
    // axios
    //   .post(Commen.baseURL + `/plan/getOne?id=${programId}`, this.formEdit)
    //   .then((response) => {
    //     console.log(response);
    //     this.program = response.data.data;
    //     this.nowPlan = response.data.data;
    //     // this.editVisible=false
    //     // this.loadList()
    //   });

    axios
      .post(Commen.baseURL + `/program/find?id=${programId}`, this.formEdit)
      .then((response) => {
        console.log(response);
        this.program = response.data.data;
        // this.nowPlan = response.data.data;
        // this.editVisible=false
        // this.loadList()
      });

    axios.post(Commen.baseURL + `/material/list`, {}).then((response) => {
      console.log(response);
      //   this.materialList = response.data.data;
      this.materialList = response.data.data.content;
      console.log("this. materialList");
      console.log(this.materialList);
    });
    this.loadList();
  },
  methods: {
    programGen() {
      let material = {
        id: 2,
        thumbnail: "1",
        programName: "",
        resolutionRatio: "",
        duration: "",
        programSize: "",
        status: "",
        author: "",
        updateTime: null,
      };
      //   let formName="materialForm"
      let formName = "program";

      CodeGen.genForm(material, formName);
    },
    materialGen() {
      let material = {
        filename: "string",
        id: 0,
        parentId: 0,
        path: "string",
        programCount: 0,
        resolutionRatio: "string",
        size: 0,
        type: "string",
        updateTime: "2022-06-29T05:51:56.471Z",
        url: "string",
        userId: 0,
      };
      //   let formName="materialForm"
      let formName = "material";

      CodeGen.genForm(material, formName);
    },
    genJpaSave() {
      // let objName=  CodeGen. getObjName("dtos")
      // console.log("objName");
      // console.log(objName);
      // static getObjName(objName){
      //  CodeGen.  genJpaSave(this.postFormPlan,"plan")
      let code = CodeGen.genJpaSaveRec(this.postFormPlan, "plan");
      console.log(code);
      //  genJpaSaveRec
      //  ObjUtil.getAllJson(this.postFormPlan, "", ">")
    },
    dateChange() {},
    // <el-bu
    genForm() {
      CodeGen.genForm(this.postFormPlan);

      //       let formRows = "";
      //       for (let o in this.postFormPlan) {
      //         console.log(o);
      //         let key = o;
      //         let val = this.postFormPlan[o];
      //         console.log(val);
      //         // <el-form-item>${key} </el-form-item>
      //         formRows += `
      //           <el-form-item label="${key}">
      //         <el-input v-model="form.${key}"></el-input>
      //       </el-form-item>\n`;
      //       }
      //       let formVueStr = `<el-form>
      //     ${formRows}
      // </el-form>`;
      //       console.log(formVueStr);
    },
    choose(material) {
      console.log("选择");
      console.log("material");
      console.log(material);
    },
    saveOne() {
      let data = {
        author: "string",
        createTime: "string",
        endDate: "string",
        endTime: "string",
        id: 0,
        multiScreenSync: "string",
        planName: "string",
        playDate: "string",
        playMode: "string",
        playStrategy: "string",
        programId: 0,
        reason: "string",
        reviewedBy: "string",
        startDate: "string",
        startTime: "string",
        status: "string",
        thumbnail: "string",
        timeSlotDtos: [
          {
            endTime: "2022-06-29T05:51:56.471Z",
            materials: [
              {
                filename: "string",
                id: 0,
                parentId: 0,
                path: "string",
                programCount: 0,
                resolutionRatio: "string",
                size: 0,
                type: "string",
                updateTime: "2022-06-29T05:51:56.471Z",
                url: "string",
                userId: 0,
              },
            ],
            programs: [
              {
                author: "string",
                duration: "string",
                id: 0,
                programName: "string",
                programSize: "string",
                resolutionRatio: "string",
                status: "string",
                thumbnail: "string",
                updateTime: "2022-06-29T05:51:56.471Z",
              },
            ],
            startTime: "2022-06-29T05:51:56.471Z",
          },
        ],
        updateTime: "string",
      };

      axios
        .post(Commen.baseURL + `/${this.tableName}/saveOne`, data)
        .then((response) => {
          console.log(response);
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    handleSearch() {
      console.log("搜搜");
      this.loadList();
    },
    editCancel() {
      this.editVisible = false;
      // getData()
      this.loadList();
    },

    handleEdit(index, row) {
      this.idx = index;
      // this.form = row;
      this.formEdit = row;
      this.editVisible = true;
    },
    saveEdit() {
      axios
        .post(Commen.baseURL + `/${this.tableName}/save`, this.formEdit)
        .then((response) => {
          this.editVisible = false;
          this.loadList();
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    handleDelete(index, row) {
      let params = { id: row.id };
      let data = {};
      let url = Commen.baseURL + `/${this.tableName}/delete`;
      axios({
        url: url,
        method: "post",
        data: data, // body参数
        params: params, // query参数
      })
        .then((response) => {
          this.loadList();
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    validate(ruleForm) {
      let params = {};
      let data = this.formData;
      let url = Commen.baseURL + `/${this.tableName}/save`;
      axios({
        url: url,
        method: "post",
        data: data, // body参数
        params: params, // query参数
      })
        .then((response) => {
          console.log("response");
          console.log(response);
          this.$message.success("提交成功！");
          this.loadList();
        })
        .catch((error) => {
          console.log(error);
          this.$message.error("提交失败！" + error);
        });
    },
    loadList() {
      let params = this.pageParam;
      // let data = {};
      let data = this.query;
      console.log("查找的 form");
      console.log(data);
      console.log(data + "");
      console.log(JSON.stringify(data));
      // let url = Commen.baseURL + `/${this.tableName}/list`;
      let url = Commen.baseURL + `/${this.tableName}/listLike`;
      axios({
        url: url,
        method: "post",
        data: data, // body参数
        params: params, // query参数
      })
        .then((response) => {
          // let content = response.data.content
          let content = response.data.data.content;
          this.tableData = content;
          // this.pageTotal = response.data.pageable.pageSize;
          this.pageTotal = response.data.totalElements;
        })
        .catch(function (error) {
          console.log(error);
        });
    },

    addTimeSlot() {
      this.postFormPlan.timeSlotDtos.push({
        startTime: "2022-06-29T05:51:56.471Z",
        endTime: "2022-06-29T05:51:56.471Z",
        materials: [
          {
            filename: "string",
            id: 0,
            parentId: 0,
            path: "string",
            programCount: 0,
            resolutionRatio: "string",
            size: 0,
            type: "string",
            updateTime: "2022-06-29T05:51:56.471Z",
            url: "string",
            userId: 0,
          },
        ],
        programs: [
          {
            author: "string",
            duration: "string",
            id: 0,
            programName: "string",
            programSize: "string",
            resolutionRatio: "string",
            status: "string",
            thumbnail: "string",
            updateTime: "2022-06-29T05:51:56.471Z",
          },
        ],
      });
    },
    loadById(id) {
      axios
        .post(Commen.baseURL + `/${this.tableName}/load`, this.pageParam)
        .then((response) => {
          let content = response.data.content;
          this.tableData = content;
          this.pageTotal = response.data.totalElements;
        })
        .catch((error) => {
          console.log(error);
        });
    },

    load(val) {
      this.pageParam.pageNumber = val - 1;
      this.loadList();
    },
  },
};
</script>

<style scoped>
.queryForm {
  width: 200px;
}
.pagination {
  margin: 20px 0;
  text-align: right;
}

.container {
  padding: 30px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
}
</style>